<script setup lang="ts">
import { ref } from 'vue'
import type { Aircraft } from './types'
import { EntityIdInput } from '../base'

const id = ref<string | null>(null)
const acType = ref<string | null>(null)

function filter(lst: Aircraft[]): Aircraft[] {
  const idStr = id.value?.trim()?.toLowerCase()
  const acTypeStr = acType.value?.trim()?.toLowerCase()
  const checkId = !(!idStr || idStr.length === 0)
  const checkAcType = !(!acTypeStr || acTypeStr.length === 0)
  if (!checkId && !checkAcType) {
    return lst
  }
  return lst.filter((e) => {
    if (checkId && e.id.toLowerCase().indexOf(idStr) < 0) {
      return false
    }
    if (checkAcType && e.aircraftType.toLowerCase().indexOf(acTypeStr) < 0) {
      return false
    }
    return true
  })
}
defineExpose({ filter })
</script>
<template>
  <div class="row">
    <div class="txt-box col-2em">id</div>
    <input class="input col-6em" v-model="id" placeholder="模糊匹配" />
    <div class="txt-box col-3em" style="margin-left: 1em">机型</div>
    <EntityIdInput class="col-6em" v-model="acType" placeholder="模糊匹配" type="AircraftType" />
  </div>
</template>
